import 'package:fate_blind_box/chat_view/ahu_text.dart';
import 'package:fate_blind_box/chat_view/chat_net_image.dart';
import 'package:fate_blind_box/config/app_style.dart';
import 'package:fate_blind_box/routes/page_route_names.dart';
import 'package:fate_blind_box/utils/default/widget_extension_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';

import 'logic.dart';

class FriendProfilePage extends GetView<FriendProfileLogic> {
  const FriendProfilePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
          _backGroundImage(),
          CustomScrollView(
            controller: controller.state.scrollController,
            slivers: [
              SliverToBoxAdapter(
                child: SizedBox(height: 136.w),
              ),
              SliverToBoxAdapter(
                child: Container(
                    padding: EdgeInsets.only(top: 32.w),
                    decoration: BoxDecoration(
                        color: Colors.white,
                        borderRadius: BorderRadius.only(
                          topLeft: Radius.circular(20.w),
                          topRight: Radius.circular(20.w),
                        )),
                    child: Column(
                      children: [
                        _personHeader(),
                        _content(),
                        SizedBox(height: 15.w),
                        Divider(
                          indent: 20.w,
                          endIndent: 20.w,
                          height: 2.w,
                          color: '#D8D8D8'.stringToColor,
                        ),
                        _fromWidget(),
                        SizedBox(height: 15.w),
                        Divider(
                          indent: 20.w,
                          endIndent: 20.w,
                          height: 2.w,
                          color: '#D8D8D8'.stringToColor,
                        ),
                        Container(
                          width: ScreenUtil().screenWidth,
                          height: ScreenUtil().screenHeight - 320.w,
                          color: Colors.white,
                        )
                      ],
                    )),
              ),
            ],
          ),
          _navigation(),
        ],
      ),
      bottomNavigationBar: _aadFriend(),
    );
  }

  ///  底部image
  Widget _backGroundImage() {
    return Image.network(
      controller.state.imageUrl,
      width: double.infinity,
      height: double.infinity,
      fit: BoxFit.fill,
    );
  }

  /// 导航栏
  Widget _navigation() {
    return Positioned(
      left: 0,
      top: 0,
      right: 0,
      height: kToolbarHeight + ScreenUtil().statusBarHeight,
      child: Obx(() {
        return Container(
          padding: EdgeInsets.symmetric(horizontal: 14.w),
          alignment: Alignment.bottomCenter,
          height: kToolbarHeight,
          color: Colors.white.withOpacity(controller.state.clarity.value),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              InkWell(
                  onTap: () => Get.back(),
                  child: Image.asset(
                    'images/left.png',
                    width: 24.w,
                    color: controller.state.clarity.value == 0
                        ? Colors.white
                        : Colors.black
                            .withOpacity(controller.state.clarity.value),
                  )),
              InkWell(
                  onTap: () => Get.toNamed(PageRouteNames.friendSetting),
                  child: Image.asset(
                    'images/more.png',
                    width: 24.w,
                    color: controller.state.clarity.value == 0
                        ? Colors.white
                        : Colors.black
                            .withOpacity(controller.state.clarity.value),
                  )),
            ],
          ),
        );
      }),
    );
  }

  /// imageHader
  Widget _personHeader() {
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 20.w),
      child: Row(
        children: [
          ChatNetImage(
            imageUrl: controller.state.imageUrl,
            width: 77.w,
            height: 77.w,
            radius: 6.w,
          ),
          SizedBox(width: 10.w),
          Expanded(
              child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  AhuText(
                    text: '用户昵称',
                    fontSize: 22,
                    fontWeight: FontWeight.w600,
                    color: '#1F1F1F'.stringToColor,
                  ),
                  SizedBox(width: 8.w),
                  Container(
                    padding:
                        EdgeInsets.symmetric(horizontal: 8.w, vertical: 1.w),
                    decoration: BoxDecoration(
                        color: '#FB6D99'.stringToColor,
                        borderRadius: BorderRadius.circular(36.w)),
                    child: Row(
                      mainAxisSize: MainAxisSize.min,
                      crossAxisAlignment: CrossAxisAlignment.center,
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        Image.asset(
                          'images/user/txl_woman_icon.png',
                          width: 10.w,
                          height: 10.w,
                          color: Colors.white,
                        ),
                        SizedBox(width: 1.w),
                        const AhuText(
                          text: '女',
                          fontWeight: FontWeight.w400,
                          fontSize: 10,
                          color: Colors.white,
                        )
                      ],
                    ),
                  )
                ],
              ),
              SizedBox(height: 8.w),
              AhuText(
                text: '商圈ID: 5627398440',
                fontSize: 14,
                fontWeight: FontWeight.w400,
                color: '#767676'.stringToColor,
              )
            ],
          ))
        ],
      ),
    );
  }

  /// 备注签名
  Widget _content() {
    return Container(
      color: Colors.white,
      padding: EdgeInsets.symmetric(horizontal: 20.w),
      margin: EdgeInsets.only(top: 32.w),
      child: Row(
        children: [
          AhuText(
            text: '备注和标签',
            color: '#171717'.stringToColor,
            fontSize: 16,
            fontWeight: FontWeight.w400,
          ),
          Expanded(
            child: AhuText(
              text: '春不晚，下江南～',
              fontSize: 14,
              fontWeight: FontWeight.w400,
              color: '#1F1F1F'.stringToColor,
              textAlign: TextAlign.end,
            ),
          ),
          Image.asset(
            'images/right.png',
            width: 8.w,
            height: 13.w,
          ),
        ],
      ),
    ).clickAction(tapAction: () => controller.toRemake());
  }

  ///  来源
  Widget _fromWidget() {
    return Container(
      color: Colors.white,
      padding: EdgeInsets.symmetric(horizontal: 20.w),
      margin: EdgeInsets.only(top: 32.w),
      child: Row(
        children: [
          AhuText(
            text: '来源',
            color: '#171717'.stringToColor,
            fontSize: 16,
            fontWeight: FontWeight.w400,
          ),
          Expanded(
            child: AhuText(
              text: '扫一扫',
              color: '#B3B3B3'.stringToColor,
              fontSize: 14,
              fontWeight: FontWeight.w400,
              textAlign: TextAlign.end,
            ),
          ),
          Image.asset(
            'images/right.png',
            width: 8.w,
            height: 13.w,
          ),
        ],
      ),
    );
  }

  /// 添加好友
  Widget _aadFriend() {
    return Container(
      height: ScreenUtil().bottomBarHeight + 84.w,
      alignment: Alignment.center,
      decoration: BoxDecoration(color: Colors.white, boxShadow: [
        BoxShadow(
          color: '#21000000'.stringToColor,
          offset: Offset(4.w, 2.w),
          blurRadius: 2.w,
          spreadRadius: 4.w,
        ),
      ]),
      child: Container(
          alignment: Alignment.center,
          height: 44.w,
          margin: EdgeInsets.symmetric(horizontal: 44.w),
          decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(22.w),
              color: '#614AC0'.stringToColor,
              boxShadow: [
                BoxShadow(
                  color: '#7F69D9'.stringToColor,
                  offset: Offset(2.w, 2.w),
                  blurRadius: 4,
                  spreadRadius: 2,
                ),
              ]),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Image.asset(
                'images/add.png',
                width: 20.w,
                height: 20.w,
                color: Colors.white,
              ),
              const AhuText(
                text: '添加好友',
                color: Colors.white,
                fontSize: 18,
                fontWeight: FontWeight.w600,
              ),
            ],
          )).clickAction(tapAction: () => controller.addMember()),
    );
  }
}
